<template>
  <PageBox :data="dataInfo" @searchBtn="getTbody" :maring="maring" :isRadio="isRadio" :isCheckbox="isCheckbox"
    @tableCheckboxBtn="tableCheckboxBtn" @tableRadioBtn="tableRadioBtn">
    <template #search="{ search }">
      <ElFormItemBox label="单据状态" prop="deliveryBillState">
        <ElSelectBox :data="search" dataName="deliveryBillState" :all="{
          label: '全部',
          value: -5,
        }" :options="options.state" />
      </ElFormItemBox>
      <ElFormItemBox label="出库状态" prop="outStockState">
        <ElSelectBox :data="search" dataName="outStockState" :all="{
          label: '全部',
          value: -1,
        }" :options="options.outStockState" />
      </ElFormItemBox>
      <ElFormItemBox label="对账状态" prop="courierFeeReconciliationStatus">
        <ElSelectBox :data="search" dataName="courierFeeReconciliationStatus" :all="{
          label: '全部',
          value: -1,
        }" :options="options.outStockState" />
      </ElFormItemBox>
    </template>
    <template #deliveryBillStateName="{ row }">
      <ElTagBox :data="row.deliveryBillState" :options="options.state" />
    </template>
    <template #outStockStateName="{ row }">
      <ElTagBox :data="row.outStockState" :options="options.outStockState" />
    </template>
    <template #deliveryBillNo="{ row }">
      <PopoverTabel :title="row.deliveryBillNo" :width="1200" :thead="[
        {
          label: '产品名称',
          prop: 'productName',
          align: 'left',
          width: null,
        },
        {
          label: '产品规格',
          prop: 'productSpecificationName',
          align: 'left',
          width: 120,
        },
        {
          label: '订单号',
          prop: 'saleOrderGroupNumber',
          align: 'center',
          width: 120,
        },
        {
          label: '协议书号',
          prop: 'xieYiShuHao',
          align: 'center',
          width: 120,
        },
        {
          label: '生产日期',
          prop: 'produceDate',
          align: 'center',
          width: 100,
        },
        {
          label: '发货数量',
          prop: 'deliveryQuantity',
          align: 'center',
          width: 80,
        },
        {
          label: '单位',
          prop: 'productUnit',
          align: 'center',
          width: 80,
        },
      ]" :tbody="row.detailList" />
    </template>
  </PageBox>
</template>
<script setup lang="ts">
const { proxy } = getCurrentInstance() as any;
import './pageCss.scss'; // 引入样式
import { useListComponent } from './pageTs'; // 引入逻辑
const props = withDefaults(
  defineProps<{
    isRadio?: boolean; //单选
    isCheckbox?: boolean; //多选
    maring?: number; //间距
    query?: any; //
  }>(),
  {},
);
const pup = reactive({
  state: false,
  typeName: 0,
  title: `结存管理`,
  width: 600,
  height: 'auto',
  form: {
    warehouseCode: '', //结存仓库代码
    excuteDate: '', //结存日期\n"2024-11-26",//需要准确到日期，前段需要限制不能超过当天日期
    stockBalanceRemark: '', //结存备注
  },
  btns: [
    {
      title: '确认',
      type: 'primary',
      click: (pup: any) => {
        pup.state = true;
        proxy.$api.StockBalance.JuadgeIsHaveStockBalanceBill(pup.form)
          .then((res: any) => {
            if (res.data) {
              proxy.$message('该仓库该日期存在结存单，不可多次创建结存单', 'error');
              pup.loading = false;
            } else {
              proxy.$api.StockBalance.CreateStockBalanceBill(pup.form)
                .then((res: any) => {
                  if (res) {
                    proxy.$message('创建成功');
                    pup.state = false;
                    getTbody();
                  } else {
                  }
                })
                .catch(() => {
                  pup.loading = false;
                });
            }
          })
          .catch(() => {
            pup.loading = false;
          });
      },
    },
  ],
});
const emit = defineEmits<{
  //fn为父组件引入子组件是定义的子组件事件属性，可随意定义
  (event: 'tableRadioBtn', row: any): void;
  (event: 'tableCheckboxBtn', arr: any): void;
}>();
//多选数据
const tableCheckboxBtn = (arr: any) => {
  emit('tableCheckboxBtn', arr);
};
//单选数据
const tableRadioBtn = (row: any) => {
  emit('tableRadioBtn', row);
};

// 组件挂载后执行
onMounted(() => {
  getTbody();
});
const { dataInfo, getTbody, options } = useListComponent({
  ...props,
  pup: pup,
});
</script>
